<template>
	<view class="">
		<view @click="leftClick()" class="leftButton fixed-top " style="">
			<u-icon name="arrow-left" color="white" size="26"></u-icon>
		</view>
		<view class="">
			<image class="BGImage1" src="/static/settled/bg.png" mode=""></image>
			<view class="bgView flex-row-center"  >
				<!-- <view class="bgView1 flex-column-center" v-if='setupData[0].border==1&&setupData[1].border==1&&setupData[2].border==1'> -->
				<view class="bgView1 flex-column-center" v-if='i'>
					<image class="image" src="/static/settled/1.png" mode=""></image>
					<view class="title">
						审核通过
					</view>
					<view @click="goFan" class="button flex-row-center">
						点击进入达人端
					</view>
				</view>
				<view class="information bgView1" v-else>
				
					<view class="setup">
						<view class="setup-item" v-for="(item,index) in setupData" :key="item.title" @tap="tourl(item.path)">
							<view class="setup-item-left">
								<view class="setup-item-left-title">{{item.title}}</view>
								<view class="setup-item-left-text">{{item.text}}</view>
							</view>
							<view class="setup-item-right">
								<view class="buttom" v-if="item.border==0">去上传</view>
				
								<view class="buttom toFinishStatus" v-if="item.border==1">已认证</view>
				
								<view class="buttom-noneBorder" style="color:red" v-if="item.border==2">未通过，请重新上传</view>
								<u-icon name="arrow-right" color="red" size="18" v-if="item.border==2"></u-icon>
				
								<view class="buttom-noneBorder" style="color:#666" v-if="item.border==2">认证中</view>
								<u-icon name="arrow-right" color="#666" size="18" v-if="item.border==2"></u-icon>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import {
		getMyIndex
	} from "./api.js"
	import tmPickersCity from '@/tm-vuetify/components/tm-pickersCity/tm-pickersCity.vue';
	import {
		uploadImage
	} from '@/config/utils'
	export default {
		components: {
			tmPickersCity
		},
		data() {
			return {
				url_link: 'https://play.bozhoukeji.cn/jh5',
				radiolist1: [{
						name: '男',
						disabled: false
					},
					{
						name: '女',
						disabled: false
					}
				],
				setupData: [{
						title: "身份认证",
						text: "请上传本人的正反面身份证照片",
						border: null,
						path: "/pages/identityAuthentication/identityAuthentication"
					},
					{
						title: "头像/相册",
						text: "请上传本人头像和相册",
						border: null,
						path: "/pages/my/avatar"
					},
					// {
					// 	title: "资质信息",
					// 	text: "请上传从业资格证书照片",
					// 	border: null,
					// 	path: "/page-mine-subcontract/qualificationCertification/qualificationCertification"
					// },
					// {
					// 	title: "健康信息",
					// 	text: "请上传有效期内的健康证照片",
					// 	border: null,
					// 	path: "/page-mine-subcontract/healthInformation/healthInformation"
					// },
					{
						title: "基本资料",
						text: "身高/个人简介等基本信息",
						border: null,
						path: "/pages/essentialInformation/essentialInformation"
					},
				],
				mssg: '',
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				radiovalue1: '男',
				realname: '',
				mobile: '',
				city: '',
				age: "",
				avatar: '',
				desc: '',
				status: '',
				flag: false,
				flag1: false,
				province: '',
				district: ''

			};
		},
		onLoad() {
			this.$http.post('api/wx/short_url', {}).then(res => {
				console.log(res, "short_url")
				this.url_link = res.url_link

			})

			this.detail()

		},
		onShow() {
			this.getIndex()
		},
		methods: {
			// 获取个人信息
			getIndex() {
				console.log('hahahhahahh');
				uni.showLoading({
					title: '加载中'
				})
				let token = uni.getStorageSync("token")
				getMyIndex({
					openid: token
				}).then(res => {
					console.log(res, "打印的子111")
					console.log(res.data,
						'data.album.lengthdata.album.lengthdata.album.length');
					if (res.code == 200) {
						uni.hideLoading()
						let data = res.data
						let info = res.data.info
			
						this.setupData.forEach(item => {
							if (item.title == "身份认证") {
			
								/* if(data.technician_identity) item.border = data.technician_identity.status
								else item.border = null */
								if (data.id_card_status == 0) {
									item.border = 0
									if (data.id_card_front_img) {
										item.border = 2
									}
								} else {
									item.border = 1
								}
							}
							if (item.title == "头像/相册") {
								/* if(data.technician_album) item.border = data.technician_album.status
								else item.border = null */
								console.log(data.avatar, data.album.length,
									'data.album.lengthdata.album.lengthdata.album.length');
								if (data.avatar && data.album.length != 0) {
									item.border = 1
			
								} else {
									item.border = 0
								}
							}
							if (item.title == "资质信息") {
								/* if(data.qualifications) item.border = data.qualifications.status
								else item.border = null */
			
								if (data.qualification_status == 0) {
									item.border = 0
									if (data.qualification) {
										item.border = 2
									}
								} else {
									item.border = 1
								}
							}
							if (item.title == "健康信息") {
								/* if(data.technician_healthy) item.border = data.technician_healthy.status
								else item.border = null */
								if (data.health_status == 0) {
									item.border = 0
									if (data.health_certificate) {
										item.border = 2
									}
								} else {
									item.border = 1
								}
							}
							if (item.title == "基本资料") {
								/* if(data.technician_data) item.border = data.technician_data.status
								else item.border = null */
			
			
								if (data.detail_status == 0) {
									item.border = 0
									/* if(data.health_certificate){
										item.border=2
									} */
								} else {
									item.border = 1
								}
							}
						})
						this.$db.set('infoAndOther', res.data)
					}
				})
			},
			tourl(e) {
				uni.navigateTo({
					url: e
				})
			},
			detail() {

				this.$http.post('api/user/detail', {}).then(res => {
					console.log(res.technician_apply_status, "打印的222222222222222222222")
					this.mobile = res.phone
					if (res.technician_apply_status == -1) {
						this.mssg = res.technician_apply_status
						// uni.showToast({
						// 	icon:'none',
						// 	// title:res.desc,
						// })
						console.log(res.desc, "等于-1的时候未申请")
					} else if (res.technician_apply_status == 1) {
						this.mssg = '您的审核已通过'
						this.flag = true
						this.flag1 = true
						// uni.showToast({
						// 	icon:'none',
						// 	// title:res.desc
						// })
						console.log(res.technician_apply_status, "等于1的时候审核通过")
					} else if (res.technician_apply_status == 0) {
						this.mssg = '审核中'
						console.log(res.technician_apply_status, "等于0的时候审核中")
						this.flag = true
						// uni.showToast({
						// 	icon:'none',
						// 	// title:res.desc
						// })
					}
				})
			},
			leftClick() {
				uni.navigateBack()
			},
			goFan() {
				// #ifdef APP-PLUS
				plus.runtime.openURL(this.url_link) //这里默认使用外部浏览器打开而不是内部web-view组件打开
				// #endif
				// #ifdef H5
				window.open(this.url_link)
				// #endif
				// uni.switchTab({
				// 	url:'/pages/my/my'
				// })
				// setTimeout( ()=>{
				// 	uni.switchTab({
				// 		url:'/pages/my/my'
				// 	})
				// },800)
			},
			selectedCity(e) {
				this.city = e[1]
				this.province = e[0]
				this.district = e[2]
				console.log(this.city, "fnain")
			},
			upload() {
				uni.chooseImage({
					count: 1,
					success: (res) => {
						let {
							tempFilePaths
						} = res;
						let filePath = tempFilePaths[0]
						uploadImage(filePath).then(res => {
							this.avatar = res.path;
							console.log(res, '/*/*/*/*/');

						})
						console.log(tempFilePaths)
					}
				})
			},
			submit() {
				if (!this.realname) {
					uni.showToast({
						icon: 'none',
						title: '请输入达人姓名'
					});
					return;
				}
				if (!(/^1[3456789]\d{9}$/.test(this.mobile))) {
					uni.showToast({
						icon: 'none',
						title: '请输入正确格式的手机号'
					});
					return;
				}
				if (!this.age) {
					uni.showToast({
						icon: 'none',
						title: '请输入达人年纪'
					});
					return;
				}
				if (!this.city) {
					uni.showToast({
						icon: 'none',
						title: '请先选择意向工作城市'
					});
					return;
				}
				this.$http.post('api/user/technician/apply', {
					username: this.realname,
					phone: this.mobile,
					age: this.age,
					city: this.city,
					avatar: this.avatar,
					sex: this.radiovalue1,
					province: this.province,
					district: this.district
				}).then(res => {
					console.log(res, 'apply');
					// plus.runtime.openURL( 'https://www.pgyer.com/Jix5');
					uni.showToast({
						icon: 'none',
						title: '提交成功'
					})
					setTimeout(() => {
						this.detail()
					}, 1000)

					// setTimeout(() =>{
					// uni.navigateBack({
					// 		delta:1
					// 	})
					// },1000)
				})
			}
		}
	};
</script>

<style scoped lang="scss">
	page {
		background-color: #ffffff00;
	}

	.BGImage1 {
		position: fixed;
		width: 100%;
		height: 100%;
		bottom: 0;
		top: 0;
		left: 0;
		z-index: -1;
	}

	.bgView {
		width: 100%;
		height: 100vh;
	}

	.bgView1 {
		width: 690rpx;
		height: 581rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		border: 10rpx solid #1E8554;
	}

	.image {
		width: 284rpx;
		height: 228rpx;
	}

	.title {
		margin-top: 12rpx;
		font-size: 34rpx;
		font-family: PingFang SC;
		// font-weight: 500;
		color: #333333;
	}

	.button {
		margin-top: 53rpx;
		width: 579rpx;
		height: 93rpx;
		background: #0DA17D;
		border-radius: 47rpx;
		font-size: 34rpx;
		font-family: PingFang SC;
		// font-weight: bold;
		color: #FFFFFF;
	}

	.topsrcomage {
		width: 100%;
		height: 100%;
	}

	.tyop {
		text-align: center;
	}

	.sersdrefuia {
		height: 550rpx;
	}

	.textbackground {
		width: 90%;
		height: 70rpx;
		background-color: #0da17d;
		color: white;
		border-radius: 50rpx;
		align-items: center;
		text-align: center;
		line-height: 70rpx;
		font-size: 30rpx;
		margin: 150rpx auto;
	}

	.centerser {
		width: 80%;
		height: 650rpx;
		background-color: white;
		border-radius: 15rpx;
		margin: -60rpx auto;
	}

	.topser {
		background-color: #17ba92;
		width: 100%;
		height: 350rpx;
	}

	.boxserss {
		width: 100%;
		height: 100%;
		background-color: #f5f5f5;
	}

	.yin {
		width: 100%;
		height: 100%;
		position: fixed;
		background-color: rgba(0, 0, 0, 0.8);
		z-index: 999;

	}

	.dog {
		width: 70%;
		height: 10%;
		background-color: white;
		border-radius: 8rpx;
		margin: 100rpx auto;
		display: flex;
		align-items: center;
		justify-content: center;
	}



	.page {
		// background-color: #f8f8f8;
		width: 100%;
		height: 100%;
		overflow-y: auto;

		.group {
			// padding-bottom: 100rpx;
			flex: 1 1 auto;
			overflow-y: auto;

			.image_1 {
				width: 100%;
				height: 400rpx;
			}

			.group_1 {
				margin-top: 400rpx;
				/* #ifdef MP||APP-PLUS */
				margin-top: 460rpx;
				/* #endif */

				padding: 0 32rpx;
				position: relative;

				.button {
					margin-top: 90rpx;
					padding: 22rpx 0;
					color: rgb(255, 255, 255);
					font-size: 32rpx;
					font-weight: 500;
					line-height: 44rpx;
					white-space: nowrap;
					background-color: rgb(24, 181, 103);
					border-radius: 44rpx;
				}

				.section_1 {
					padding: 28rpx 24rpx;
					background-color: rgb(255, 255, 255);
					border-radius: 24rpx 24rpx 0px 0px;

					.text_1 {
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						font-weight: 500;
						line-height: 40rpx;
						white-space: nowrap;
					}

					.text_2 {
						margin-left: 48rpx;
						color: rgb(153, 153, 153);
						font-size: 28rpx;
						line-height: 40rpx;
						white-space: nowrap;
					}
				}

				.section_2 {
					padding: 24rpx 24rpx 26rpx;
					color: rgb(0, 0, 0);
					font-size: 28rpx;
					font-weight: 500;
					line-height: 40rpx;
					white-space: nowrap;
					background-color: rgb(255, 255, 255);

					.text_3 {
						margin-top: 4rpx;
					}

					.image_2 {
						width: 44rpx;
						height: 44rpx;
					}

					.image_3 {
						margin-left: 48rpx;
					}

					.text_4 {
						margin-left: 4rpx;
						margin-top: 4rpx;
					}

					.image_4 {
						margin-left: 40rpx;
					}

					.text_5 {
						margin-left: 4rpx;
						margin-bottom: 4rpx;
					}
				}

				.section_3 {
					padding: 28rpx 24rpx;
					background-color: rgb(255, 255, 255);

					.text_6 {
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						font-weight: 500;
						line-height: 40rpx;
						white-space: nowrap;
					}

					.text_7 {
						margin-left: 48rpx;
						color: rgb(153, 153, 153);
						font-size: 28rpx;
						line-height: 40rpx;
						white-space: nowrap;
					}

					.text_8 {
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						font-weight: 500;
						line-height: 40rpx;
						white-space: nowrap;
					}

					.text_9 {
						margin-left: 48rpx;
						color: rgb(153, 153, 153);
						font-size: 28rpx;
						line-height: 40rpx;
						white-space: nowrap;
					}

					.image_5 {
						margin-bottom: 6rpx;
						width: 32rpx;
						height: 32rpx;
					}

					.text_10 {
						color: rgb(0, 0, 0);
						font-size: 28rpx;
						font-weight: 500;
						line-height: 40rpx;
						white-space: nowrap;
					}

					.text_11 {
						margin-left: 48rpx;
						color: rgb(153, 153, 153);
						font-size: 28rpx;
						line-height: 40rpx;
						width: 450rpx;
					}
				}

				.section_4 {
					padding: 28rpx 23rpx 31rpx;
					color: rgb(0, 0, 0);
					font-size: 28rpx;
					font-weight: 500;
					line-height: 40rpx;
					white-space: nowrap;
					background-color: rgb(255, 255, 255);
					border-radius: 0px 0px 24rpx 24rpx;

					.group_4 {
						margin-top: 31rpx;
						padding: 71rpx 0 71rpx;
						position: relative;

						.image_6 {
							margin-left: 71rpx;
							width: 56rpx;
							height: 56rpx;
						}

						.image_7 {
							border-radius: 24rpx;
							width: 198rpx;
							height: 198rpx;
							position: absolute;
							left: 0;
							top: 0;
						}

						.avatar {
							border-radius: 24rpx;
							position: absolute;
							width: 198rpx;
							height: 198rpx;
							position: absolute;
							left: 0;
							top: 0;
							z-index: 9;
						}
					}
				}
			}
		}
	}
</style>
<style lang="less">
	.information {
		// width: 100%;
		// height: 100%;
		// background: #FFFFFF;

		.tips {
			height: 192rpx;
			background: #FFFFFF;
			border: 1rpx solid #fff;

			.tips-header {
				margin-top: 8rpx;
				height: 76rpx;
				display: flex;
				align-items: center;
				padding: 0 32rpx;

				.tips-header-icon {
					width: 36rpx;
					height: 36rpx;
					border-radius: 50%;
					background: linear-gradient(180deg, #46D17E 0%, #3EC735 100%);
				}

				.tips-header-title {
					font-size: 32rpx;
					font-weight: bold;
					color: #262626;
					margin-left: 16rpx;

				}

			}

			.tips-text {
				font-size: 28rpx;
				font-weight: 400;
				color: #666666;
				padding: 0 32rpx;
			}
		}

		.setup {
			.setup-item {
				box-sizing: border-box;
				width: 100%;
				height: 140rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 0 32rpx;
				border-top: #d6d7d9 solid 1rpx;

				.setup-item-left {
					.setup-item-left-title {
						font-size: 32rpx;
						font-weight: bold;
						color: #262626;
					}

					.setup-item-left-text {
						font-size: 28rpx;
						font-weight: 400;
						color: #666666;
						margin-top: 10rpx;
					}

				}

				.setup-item-right {
					display: flex;
					justify-content: space-between;
					align-items: center;

					.buttom {
						width: 142rpx;
						height: 56rpx;
						background: #FFFFFF;
						border: 4rpx solid #0ea17d;
						border-radius: 48rpx;
						text-align: center;
						line-height: 56rpx;
						font-size: 30rpx;
						font-weight: bold;
						color: #0ea17d;

						&.toFinishStatus {
							color: #E4E4E4;
							border: 4rpx solid #E4E4E4;
						}
					}

					.buttom-noneBorder {
						font-size: 28rpx;
						font-weight: 400;
						color: #46D17E;
						margin-right: 13rpx;
					}

				}
			}
		}
	}
</style>